<template>
  <div class="print-details">
    <template v-for="(info, index) in infos">
      <div class="box" :key="index">
        <div class="header">
          <header>
            <span class="title">门诊处方单</span>
            <div class="time">{{ printTime }}</div>
            <span class="order-no">{{ orderInfo.apiOrderNo || orderInfo.orderNo }}</span>
          </header>
        </div>
        <div class="print-box">
          <div class="user-info">
            <table>
              <tr>
                <td>患者</td>
                <td class="name">{{ orderInfo.patientName }}&nbsp;{{ getPatientSex(orderInfo.patientSex) }}&nbsp;{{ orderInfo.patientAge }}</td>
                <!-- <td>电话</td>
                <td style="min-width:20px"></td> -->
                <td>科室</td>
                <td style="min-width:20px">{{ consult.consultDepartName }}</td>
              </tr>
              <tr>
                <td>诊断</td>
                <td colspan="3">{{ consult.diagnosis }}</td>
              </tr>
              <tr v-if="orderInfo.remark " >
                <td>备注</td>
                <td colspan="3">{{ orderInfo.remark }}</td>
              </tr>
              <tr>
                <td>
                  <template v-if="orderInfo.deliveryType === 1">
                    收货地址
                  </template>
                  <template v-else>
                    取货方式
                  </template>
                </td>
                <td colspan="3">
                  <template v-if="orderInfo.deliveryType === 1">
                  {{ nameAndPhone }} {{ adderss }}
                  </template>
                  <template v-else>
                    患者自取
                  </template>
                </td>
              </tr>
            </table>
          </div>
          <div class="print-content">
            <div style="font-size: 15px; font-weight: bold;">RP</div>
              <div class="print-infos">
                <!-- <div  style="text-align:center;padding-top:10px">{{durtType(info.prescriptionType)}}</div> -->
                <ul class="drugs">
                  <template v-for="drug in info.infoDrugs">
                    <template v-if="drug.quantity - drug.refundCount > 0">
                      <template v-if="info.prescriptionType != 2">
                        <li class="item" :key="drug.id">
                          <span>{{ drug.drugName }}{{ getDecoctionName(drug.decoctionName) }}</span>
                          <span>{{ drug.dose }}{{ drug.doseUnit }}</span>
                        </li>
                      </template>
                      <template v-else>
                        <template v-if="drug.isCirulation != 1">
                          <li class="item item2" :key="drug.id">
                          <span>{{ drug.drugName }}{{ getDecoctionName(drug.decoctionName) }} ({{drug.drugManufactor}})</span>
                          <span>{{ drug.specification }}</span>
                          <span>{{ drug.quantity - drug.refundCount }}{{ drug.packUnit }}</span>
                          <span>{{ drug.frequency }}</span>
                          <span>{{ drug.useFlag }}</span>
                        </li>
                        </template>
                      </template>
                    </template>
                  </template>
                </ul>
                <div class="info" v-if="info.prescriptionType != 2">
                  <el-row class="print-line-height">
                     <el-col class="font-bold" :span="24">{{ info.infoDrugs.length }}味药材 总重{{ info.drugTotal }}</el-col>
<!--                    <el-col class="font-bold" :span="24">{{ info.infoDrugs.length }}味药材</el-col>-->
                  </el-row>
                  <el-row class="print-line-height">
                    <el-col class="font-bold" :span="12">
                      <span>共</span>
                      <span style="font-size: 24px">{{ info.num }}</span>
                      <span>付 {{ info.frequency }}</span>
                      <template v-if="info.useFlag"> {{ info.useFlag }}</template>
                    </el-col>
                    <el-col class="col-right" :span="12">医生嘱咐：{{ orderInfo.phRemark || '暂无' }}</el-col>
                  </el-row>
                </div>
                <div class="info" v-else>
                  <el-row class="print-line-height" v-if="orderInfo.deliveryType === 1">
                      <el-col class="font-bold" :span="24"></el-col>
                  </el-row>
                  <el-row class="print-line-height">
                    <el-col :span="12">医生嘱咐：{{ info.phRemark || '暂无' }}</el-col>
                  </el-row>
                </div>
              </div>
          </div>
          <footer class="print-foot">
            <table>
              <template v-if="info.prescriptionType != 2">
                <tr>
                  <td>药房</td>
                  <td>{{ orderInfo.sourceStoreName || store.storeName }}</td>
                  <td>加工方式</td>
                  <td>
                    <template v-if="info.prescriptionType == 1">
                      <dosageForm :pstType="info.pstType" :dosageForm="info.dosageForm"></dosageForm>
                    </template>
                    <template v-if="info.prescriptionType == 3">颗粒</template>
                  </td>
                  <td>费用</td>
                  <td>
                    <span>药费：{{ formatMoney(info.drugCost, 2)}}</span>
                    <span v-if="info.processCost" style="padding:0 5px 0 5px">加工费：{{ formatMoney(info.processCost, 2)}}</span>
                  </td>
                </tr>
              </template>
              <template v-else>
                <tr>
                  <td>药房</td>
                  <td colspan="3">{{ orderInfo.sourceStoreName || store.storeName }}</td>
                  <td>费用</td>
                  <td>
                    <span>药费：{{ formatMoney(info.drugCost-info.cirulationCost, 2)}}</span>
                    <span v-if="info.processCost" style="padding:0 5px 0 5px">加工费：{{ formatMoney(info.processCost, 2)}}</span>
                  </td>
                </tr>
              </template>
              <tr>
                <td>医师</td>
                <td>{{ orderInfo.docName }}</td>
                <td>医师签字</td>
                <td class="doctor-sign doctor-name">{{ orderInfo.docName }}</td>
                <td>开方日期</td>
                <td>{{ orderInfo.orderTime }}</td>
              </tr>
              <tr>
                <td colspan="6">
                  <span>审方：</span>
                  <span class="doctor-sign">____________</span>
                  <span>调配：</span>
                  <span class="doctor-sign">____________</span>
                  <span>核对：</span>
                  <span class="doctor-sign">____________</span>
                  <span>发药：</span>
                  <span class="doctor-sign">______</span>
                </td>
              </tr>
            </table>
          </footer>
        </div>
        <div style="page-break-after:always;"></div>
      </div>
    </template>
  </div>
</template>

<script>
import dosageForm from "@/views/charges/clinicCharges/module/dosageForm";
import { formatMoney, getPatientSex } from "@/utils/index";

export default {
  name: "printDetails",
  props: {
    data: {
      type: Object,
      default() {
        return null;
      }
    }
  },
  components: { dosageForm },
  data() {
    return {
      printConfig: {
        id: "#printChargeDetail",
        popTitle: "打印预览"
      },
      orderInfo: {},
      consult: {},
      infos: [],
      store: {},
      orderAddress: {},
      pstTypeList: ['西药及中成药', '饮片', '颗粒', '打粉', '制丸', '膏方'],
    }
  },
  watch: {
    data() {
      this.loadData();
    }
  },
  computed: {
    adderss() {
      if(this.orderAddress && this.orderAddress.username) {
        return `${ this.orderAddress.province }${ this.orderAddress.city }${ this.orderAddress.area }${ this.orderAddress.address }`;
      }
      return "";
    },
    nameAndPhone() {
      if(this.orderAddress && this.orderAddress.username) {
        return `${ this.orderAddress.username } ${ this.orderAddress.phone }`;
      }
      return "";
    },
    printTime() {
      // 打印时间
      let d = new Date();
      let r = d.getFullYear() + "-";
      if(d.getMonth() + 1 >= 10) {
        r += (d.getMonth() + 1) + "-";
      } else {
        r += "0" + (d.getMonth() + 1) + "-";
      }
      if(d.getDate() >= 10) {
        r += d.getDate() + " ";
      } else {
        r += "0" + d.getDate() + " ";
      }
      if(d.getHours() >= 10) {
        r += d.getHours() + ":";
      } else {
        r += "0" + d.getHours() + ":";
      }
      if(d.getMinutes() >= 10) {
        r += d.getMinutes() + ":";
      } else {
        r += "0" + d.getMinutes() + ":";
      }
      if(d.getSeconds() >= 10) {
        r += d.getSeconds();
      } else {
        r += "0" + d.getSeconds();
      }
      return r;
    }
  },
  mounted() {
    this.loadData();
  },
  methods: {
    formatMoney,
    getPatientSex,
    durtType(type){
        switch (type) {
            case 1:
                return '中药处方(饮片)'
                break;
            case 2:
                return '成药处方'
                break;
            case 3:
                return '中药处方(颗粒剂) '
                break;
            case 4:
                return '输液处方'
                break;
            case 5:
                return '敷贴处方'
                break;
            default:
                break;
        }
    },
    loadData() {
      if(!this.data) return;

      let { order, infos, consult, orderAddress, store } = this.data;
      this.orderInfo = order;
      this.store = store;

      this.infos = infos;
      var newList = [];
      this.infos.forEach(item => {
        if(item.payStatus != 3&&item.payStatus != 4&&item.orderCondition != 5){
          newList.push(item);
          // var index = this.infos.indexOf(item)
          // this.infos.splice(index,1)
        }
      });
      this.infos = [];
      this.infos = newList;
      this.consult = consult;
      this.orderAddress = orderAddress;

      this.infos.forEach(info => {
        let drugTotal = 0;
        info.infoDrugs.forEach(drug => {
          if(info.prescriptionType === 2) {
            drugTotal += drug.quantity;
          } else {
            drugTotal += drug.dose;
          }
        });
        if(info.prescriptionType != 2) {
          // 非成药，总净重*剂数，并带上剂量单位
          drugTotal = drugTotal * info.num;
          drugTotal += "" + info.infoDrugs[0].doseUnit;
        }
        info.drugTotal = drugTotal;
      });
    },
    getDecoctionName(name) {
      if(!name || name == '常规') {
        return '';
      }
      return "(" + name + ")";
    }
  }
}
</script>

<style lang="scss" scoped>
@media print {
  .print-details {
    .box {
      padding-top: 20px;
    }
  }
}

.print-details {
  min-height: 80mm;

  .header {
    padding: 10px 0;
    margin: auto;
    width: 140mm;

    header {
      position: relative;
      text-align: center;
      font-size: 16px;

      .title {
        font-weight: bold;
      }

      .time {
        position: absolute;
        line-height: 18px;
        left: 0;
        top: 0;
      }

      .order-no {
        position: absolute;
        right: 0;
        top: 0;
      }
    }
  }

  .print-box {
    border: 1px solid #000;
    margin: 0 auto 20px;
    width: 140mm;

    label {
      font-weight: normal;
    }

    .user-info {
      .name {
        font-weight: bold;
        font-size: 15px;
      }
    }

    table {
      border-collapse: collapse;
      width: 100%;

      tr {
        border-bottom: 1px solid #000;

        &:last-child {
          border-bottom-width: 0;
        }

        td {
          border-left: 1px solid #000;
          text-align: center;
          padding: 10px 0;

          &:first-child {
            border-left: 0;
          }
        }
      }
    }

    .print-content {
      border-top: 1px solid;
      font-size: 13px;
      padding: 5px;

      .print-infos {
        border-bottom: 1px solid #000;
        .font-bold {
          font-weight: bold;
        }

        .drugs {
          min-height: 80mm;
          padding: 0;
          margin: 0;

          .item {
            display: inline-block;
            padding-top: 15px;
            font-size: 15px;
            width: 32%;
          }

          .item2 {
            width: 100%;

            span {
              padding-right: 20px;
            }
          }
        }

        .info {
          .print-line-height {
            line-height: 5mm;

            .col-right {
              text-align: right;
            }
          }
        }
      }
    }

    .print-foot {
      border-top: 1px solid;
      font-size: 13px;

      .doctor-sign {
        visibility: hidden;
      }

      .doctor-name {
        padding: 0 15px;
      }
    }
  }

}
</style>
